import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
        debugShowCheckedModeBanner: false, //去掉debug图标
        title: 'Material App',
        home: HomePage());
  }
}

class HomePage extends StatefulWidget {
  const HomePage({super.key});

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage>
    with SingleTickerProviderStateMixin {
  late TabController _tabController;

  // 生命周期函数：当组件初始化的时候就会触发
  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    _tabController = TabController(length: 3, vsync: this);
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        leading: IconButton(
          icon: const Icon(Icons.menu),
          onPressed: () {
            print("左侧按钮图标");
          },
        ),
        backgroundColor: Colors.red,
        title: const Text('头部滑动导航'),
        actions: [
          IconButton(
            icon: const Icon(Icons.search),
            onPressed: () {
              print("搜索图标");
            },
          ),
          IconButton(
            icon: const Icon(Icons.more_horiz),
            onPressed: () {
              print("更多图标");
            },
          ),
        ],
        bottom: TabBar(
            isScrollable: true, //是否可以滚动
            indicatorColor: Colors.white, //指示器颜色
            indicatorWeight: 5, //指示器高度
            indicatorPadding:const EdgeInsets.fromLTRB(0, 10, 0, 10), //指示器内边距
            indicatorSize: TabBarIndicatorSize.label, //指示器大小
            // indicator: BoxDecoration(
            //   color: Colors.blue,
            //   borderRadius: BorderRadius.circular(8)
            // ),
            labelColor: Colors.greenAccent, //选中文字颜色
            unselectedLabelColor: Colors.white, //未选中文字颜色
            labelStyle: const TextStyle(
                fontSize: 20
            ),
            unselectedLabelStyle: const TextStyle(
                fontSize: 14
            ),
            controller: _tabController,
            tabs: const [
              Tab(
                child: Text("关注"),
              ),
              Tab(
                child: Text("热门"),
              ),
              Tab(
                child: Text("视频"),
              ),
            ]),
      ),
      body: TabBarView(controller: _tabController, children: [
        ListView(
          children: const [
            ListTile(
              title: Text("我是关注列表"),
            )
          ],
        ),
        ListView(
          children: const [
            ListTile(
              title: Text("我是热门列表"),
            )
          ],
        ),
        ListView(
          children: const [
            ListTile(
              title: Text("我是视频列表"),
            )
          ],
        ),
      ]),
    );
  }
}
